<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
         .container1{
            width: 200px;
            height: 200px;
            background-color: red;
            }
        .container{
            width: 200px;
            height: 200px;
            /* background-image: url(./素材/image/bang.gif); */
            /* background-repeat: no-repeat; */
            /* background-color: cornsilk; */
            /* 背景图的最长的边放大 */
            /* background-size: contain; */
            /* 背景图的最短的边放大 */
            /* background-size: cover; */
            /* 背景图的宽高分别为50px */
            /* background-size: 50px 50px; */
            /* 背景图的宽为100px */
            /* background-size: 100px auto; */
            /* 背景图的高为100px */
            /* background-size: auto 100px; */
            /* 背景图大小等于盒子的大小 */
            /* background-size: 100% 100%; */
            background: cornsilk url(./素材/image/bang.gif) no-repeat fixed  100px 100px/50px 50px;
                        /* 颜色       背景图的链接             重复方式   定位方式  定位尺寸/背景图的尺寸*/
            
        }
    </style>
</head>
<body>
    <div class="container">

    </div>
    <div class="container1">

    </div>
    <div class="container1">

    </div>
    <div class="container1">

    </div>
    <div class="container1">

    </div>
    <div class="container1">

    </div>
    <div class="container1">

    </div>
</body>
</html>